<template>
	<div class="check-task-detail">
		<div>
			<div class="check-task-title">{{ data.CheckTaskName }}</div>
			<eagle-input
				v-model="data.CheckTypeName"
				label="检查类型"
				readonly
			></eagle-input>
			<eagle-input
				v-model="data.CreateChnName"
				label="任务发起人"
				readonly
			></eagle-input>
			<eagle-input
				v-model="data.CreateDate"
				label="任务发起时间"
				readonly
			></eagle-input>
			<eagle-input
				v-model="data.CheckNames"
				label="检查人"
				readonly
			></eagle-input>
			<eagle-input
				:value="data.StartDate + '至' + data.EndDate"
				label="检查时间段"
				autosize
				type="textarea"
				readonly
			></eagle-input>
			<eagle-input
				v-model="data.CheckRequirement"
				label="检查要求"
				placeholder="暂无检查要求"
				readonly
				autosize
				type="textarea"
			></eagle-input>
			<eagle-input
				:value="'隐患：' + data.HiddenDangerCnt + '/检查：' + data.CheckCnt"
				label="检查记录"
				readonly
			></eagle-input>
			<eagle-input
				class="input_text"
				label="检查现场照片"
				placeholder="未上传检查现场照片"
				readonly
				@click="_checkPhotos"
				islink
			></eagle-input>
			<div class="bottom-btns">
				<eagle-button class="submit-btn" type="primary" @click="_goTakePhoto()">
					随手拍
				</eagle-button>
				<eagle-button type="info" class="submit-btn" @click="save(false)">
					检查表检查
				</eagle-button>
				<eagle-button
					type="warning"
					class="submit-btn"
					@click="BackHiddenDanger()"
				>
					依据检查
				</eagle-button>
			</div>
		</div>
	</div>
</template>

<script>
import { mapGetters } from 'vuex'
import { formatDate, getDate } from '@/utils/getDate'

export default {
	data() {
		return {
			id: this.$route.query.id,
			data: {},
			uploader: [{ url: 'https://img.yzcdn.cn/vant/leaf.jpg' }],
			showCalendar: false,
			idx: '',
			show: false,
			showChooseTask: false,
			activeIcon: require('@/assets/Images/AppIcon/item_check_transparent.png'),
			fileList: [],
		}
	},
	computed: {
		...mapGetters(['baseUrl']),
	},
	created() {
		this.getDetail()
	},
	activated() {},
	methods: {
		// 计划详情
		getDetail() {
			const param = {
				id: this.id,
			}
			let _this = this;
			_this.$axios
      			.get("/DangerCheckTask/GetDetail",{params:param})
				  .then((res)=>{
					  _this.data = res.data
				  })
		},
		// 任务详情()
		_checkPhotos(item){
				// this.$router.push('/DangerCheckTaskFileList?id='+item.CTCode)
		},
		// 打开日历
		openCalendar() {
			this.showCalendar = true
		},
		onConfirm(date) {
			const dateTime = formatDate(date)
			this.data.c_time = getDate(dateTime)
			this.showCalendar = false
		},
		// 选择计划重复
		_chooseTask() {
			this.showChooseTask = true
		},
		closeChooseTask(type) {
			if (type) {
				this.data.CheckFrequencies.forEach((item) => {
					if (item.ID == type) {
						this.data.CheckFrequencyName = item.Name
					}
				})
			}
			this.showChooseTask = false
		},

		save(Confirm) {},
		// 随手拍
		_goTakePhoto() {
			this.$router.push('/OtherDanger/DangerConfirmDetail')
		},
		// 依据检查
		BackHiddenDanger() {
			this.$router.push('/OtherDanger/Classifys')
		},
		// 	关闭
		close(type) {
			this.show = false
			if (type) {
				setTimeout(() => {
					this.$router.push('/OtherDanger/DangerCheckTaskConfirmList')
				}, 500)
			}
		},
		_goCheckTaskPeople() {
			this.$router.push('/OtherDanger/Department')
		},
	},
}
</script>

<style lang="less" scoped>
.check-task-detail {
	height: 100vh;
	background-color: #e8f1f8;
}
.check-task-title {
	height: 40px;
	text-align: center;
	line-height: 40px;
	font-size: 14px;
}

.check-task {
	background-color: #e8f1f8;
	padding-bottom: 20px;
}
.problem {
	margin-bottom: 10px;
}
.bottom-btns {
	margin-top: 10px;
	padding: 0 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	.submit-btn {
		width: 30%;
		height: 30px;
		font-size: 12px;
	}
}
.warning {
	color: #f00000;
	background-color: #fff;
	padding: 10px;
	font-size: 10px;
}

.det_tab_item {
	padding: 10px 0;
	background-color: #fff;
	border-radius: 5px;
	margin-bottom: 10px;

	.det_tab_item_text {
		padding: 0 10px;
	}
}
.operate_det {
	background-color: #fff;
	padding: 10px;
	.operate_list {
		font-size: 12px;
		border: 1px solid #e8f1f8;
		.operate_row_first {
			padding: 10px;
			background-color: #e8f1f8;
			border-bottom: 1px solid #e8f1f8;
			margin-bottom: 10px;
		}
		.operate_row {
			padding: 10px;
			border-bottom: 1px solid #e8f1f8;
			/*margin-bottom: 10px;*/
		}
	}
}
</style>
